import React from 'react';
import { Input,Select,DatePicker,Table,Button } from 'antd';
const { RangePicker } = DatePicker;
const { Option } = Select;
import '../attendance/index.css';
const columns = [
  {
    title: '日期',
    dataIndex: 'name',
    width: 150,
     
  },
  {
    title: '小组',
    dataIndex: 'age',
    width: 150,
     
  },
  {
    title: '院系',
    dataIndex: 'address',
     
  },
  {
    title: '专业',
    dataIndex: 'address',
     
  },
  {
    title: '班级',
    dataIndex: 'address',
     
  },
  {
    title: '项目名称实训老师',
    dataIndex: 'address',
     
  },
  {
    title: '责任老师',
    dataIndex: 'address',
     
  },
  {
    title: '学号',
    dataIndex: 'address',
     
  },
  {
    title: '姓名',
    dataIndex: 'address',
     
  },
  {
    title: '考勤情况',
    dataIndex: 'address',
     
  },
  {
    title: '应签到',
    dataIndex: 'address',
     
  },
  {
    title: '实签到',
    dataIndex: 'address',
     
  },
  {
    title: '应签退',
    dataIndex: 'address',
     
  },
  {
    title: '实签退',
    dataIndex: 'address',
     
  },
  {
    title: '操作',
    dataIndex: 'address',
     
  },
];

const date_list: readonly any[] | undefined = [];
for (let i = 0; i < 100; i++) {
  date_list.push({
    key: i,
    name: `Edward King ${i}`,
    age: 20,
    address: `London, Park Lane no. ${i}`,
  });
}
const Check = () => {
  return (
       <div>
         <div className="box_bnt3">
             <Button className="but" size="large">项目考勤记录</Button>
             <Button className="but" size="large">门禁打卡记录</Button>
         </div>
        <div className="Top3">
            
          <div className="spn">日期：
          <RangePicker className="rq" />
          </div>

          <div className="spn">院系：
          <Select className="sel" size="small"  placeholder="请选择">
              <Option value="jack">Jack</Option>
              <Option value="lucy">Lucy</Option>
              <Option value="tom">Tom</Option>
            </Select>
          </div>

          <div className="spn">专业：
            <Select className="sel" size="small"  placeholder="请选择">
              <Option value="jack">Jack</Option>
              <Option value="lucy">Lucy</Option>
              <Option value="tom">Tom</Option>
            </Select>
            </div>

            <div className="spn">年级：
            <Select className="sel" size="small"  placeholder="请选择">
              <Option value="jack">Jack</Option>
              <Option value="lucy">Lucy</Option>
              <Option value="tom">Tom</Option>
            </Select>
            </div>

            <div className="spn">班级:
              <Select  placeholder="请选择" size="small" className="sel" >
                <Option value="jack">Jack</Option>
                <Option value="lucy">Lucy</Option>
                <Option value="tom">Tom</Option>
              </Select>
              </div>
        </div>

        <div className="Top3">
          <div className="spn">项目名称：
          <Select className="sel" size="small"  placeholder="请选择">
              <Option value="jack">Jack</Option>
              <Option value="lucy">Lucy</Option>
              <Option value="tom">Tom</Option>
            </Select>
            </div>

              <div className="spn">
              <span>学号:</span>
              <DatePicker className="rq" />
              </div>

              <div className="spn">学院姓名:
              <Input  className="sel" placeholder="请录入"></Input>
              </div>

              <div className="spn">考勤情况:
              <Select  placeholder="请选择" size="small" className="sel" >
                <Option value="jack">Jack</Option>
                <Option value="lucy">Lucy</Option>
                <Option value="tom">Tom</Option>
              </Select>
              </div>

            <div className="div_but"> 
              <Button className="bt" size="large"  type="primary">查询</Button> 
                <Button size="large"  className="bt">重置</Button> 
                </div> 
            </div> 
        <div className="box_tab3"><Table  columns={columns}  dataSource={date_list} pagination={{ pageSize: 5 }} scroll={{ y: 400 }} /></div>  
      
    </div>
  );
};

export default Check;
